<template>
	<view class="content">
		<!-- 列表内容 -->
		<view class="con-list">
			<view class="list-item" v-for="item in list" :key="item.id" @click="handleGetDetails(item)">
				<view class="list-item-box">
					<view class="item-left">
						<view class="item-con">
							<view class="list-item-title">
								事项名称：
							</view>
							<view class="list-item-text">
								{{item.name ? item.name : '-'}}
							</view>
						</view>
						<view class="item-con">
							<view class="list-item-title">
								单据编号：
							</view>
							<view class="list-item-text">
								{{item.documentNumber?item.documentNumber:'-'}}
							</view>
						</view>
						<view class="item-con">
							<view class="list-item-title">
								业务时间：
							</view>
							<view class="list-item-text">
								{{item.businessTime?customFormat(item.businessTime):'-'}}
							</view>
						</view>
						<view class="item-con">
							<view class="list-item-title">
								状态：
							</view>
							<view class="list-item-text">
								{{item.statusName ? item.statusName : '-'}}
							</view>
						</view>
					</view>
					<view class="item-right">
					</view>
				</view>
			</view>
		</view>

		<!-- 加载状态提示 -->
		<view class="loading-status">
			<text v-if="loading" class="loading-text">加载中...</text>
			<text v-else-if="isFinished" class="finished-text">没有更多数据了</text>
			<text v-else-if="hasMore" class="loadmore-text">上拉加载更多</text>
		</view>
	</view>
</template>

<script>
	import {
		getWarehousingPage
	} from "@/api/index.js"
	import {
		parseTime,
		formatTime,
		formatTimestamp
	} from "@/utils/ruoyi"

	export default {
		data() {
			return {
				list: [],
				queryParams: {
					pageNo: 1,
					pageSize: 10
				},
				loading: false, // 是否正在加载
				hasMore: true, // 是否还有更多数据
				isFinished: false, // 是否已加载完所有数据
				total: 0 // 总数据量
			}
		},

		onLoad: function() {
			this.handleGetList()
		},
		onShow() {
			this.handleGetList()

		},
		onReachBottom: function() {
			// 页面滚动到底部时触发
			if (this.hasMore && !this.loading) {
				this.loadMore()
			}
		},

		onPullDownRefresh: function() {
			// 下拉刷新
			this.refreshList()
		},

		methods: {
			formatTime(timestamp) {
				return formatTimestamp(timestamp, 'time')
			},

			customFormat(timestamp) {
				return formatTime(timestamp, 'YYYY-MM-DD HH:mm:ss')
			},

			// 获取列表 - 初始加载或刷新
			handleGetList() {
				this.loading = true
				this.queryParams.pageNo = 1

				getWarehousingPage(this.queryParams).then(res => {
					console.log(res, '初始加载响应')
					if (res.code == 0) {
						this.list = res.data.list || []
						this.total = res.data.total || 0

						// 判断是否还有更多数据
						this.hasMore = this.list.length < this.total
						this.isFinished = !this.hasMore

						// 如果第一页就加载完了所有数据
						if (this.list.length >= this.total) {
							this.isFinished = true
							this.hasMore = false
						}
					} else {
						// 请求失败处理
						uni.showToast({
							title: res.msg || '加载失败',
							icon: 'none'
						})
					}
				}).catch(error => {
					console.error('请求失败:', error)
					uni.showToast({
						title: '网络错误',
						icon: 'none'
					})
				}).finally(() => {
					this.loading = false
					uni.stopPullDownRefresh() // 停止下拉刷新动画
				})
			},

			// 加载更多数据
			loadMore() {
				if (!this.hasMore || this.loading) return

				this.loading = true
				this.queryParams.pageNo += 1

				getWarehousingPage(this.queryParams).then(res => {
					console.log(res, '加载更多响应')
					if (res.code == 0) {
						const newList = res.data.list || []
						this.list = [...this.list, ...newList]

						// 更新总数据量（以防后端数据有变化）
						this.total = res.data.total || this.total

						// 判断是否还有更多数据
						const currentTotal = this.list.length
						this.hasMore = currentTotal < this.total
						this.isFinished = !this.hasMore

						// 如果当前页返回的数据少于pageSize，说明没有更多数据了
						if (newList.length < this.queryParams.pageSize) {
							this.hasMore = false
							this.isFinished = true
						}

						// 显示加载提示
						// if (newList.length > 0) {
						// 	uni.showToast({
						// 		title: `加载了${newList.length}条新数据`,
						// 		icon: 'none',
						// 		duration: 1500
						// 	})
						// }
					} else {
						// 加载失败时，页码回退
						this.queryParams.pageNo -= 1
						uni.showToast({
							title: res.msg || '加载失败',
							icon: 'none'
						})
					}
				}).catch(error => {
					console.error('加载更多失败:', error)
					this.queryParams.pageNo -= 1 // 失败时页码回退
					uni.showToast({
						title: '网络错误',
						icon: 'none'
					})
				}).finally(() => {
					this.loading = false
				})
			},

			// 刷新列表
			refreshList() {
				this.queryParams.pageNo = 1
				this.hasMore = true
				this.isFinished = false
				this.handleGetList()
			},

			// 点击列表项的处理方法
			handleGetDetails(item) {
				// 这里可以添加跳转到详情页的逻辑
				console.log('点击了项目:', item)
				if (item.code == 1) {
					//入库
					this.$tab.navigateTo(
						`/pages/indexDetails/warehouse?id=${item.id}&documentNumber=${item.documentNumber}`)
				} else if (item.code == 2) {
					// 出库 
					this.$tab.navigateTo(`/pages/indexDetails/outbound?id=${item.id}&documentNumber=${item.documentNumber}`)
				} else if (item.code == 3) {
					// 盘点
					this.$tab.navigateTo(`/pages/indexDetails/review?id=${item.id}&documentNumber=${item.documentNumber}`)
				} else if(item.code == 4){
					// 调拨入库
					this.$tab.navigateTo(`/pages/indexDetails/allocationWarehouse?id=${item.id}&documentNumber=${item.documentNumber}`)
				}else if(item.code == 5){
					// 调拨出库
					this.$tab.navigateTo(`/pages/indexDetails/allocationOutbound?id=${item.id}&documentNumber=${item.documentNumber}`)
				}
				// uni.showToast({
				//   title: `点击了: ${item.name || '未命名'}`,
				//   icon: 'none'
				// })
			}
		}
	}
</script>

<style lang="scss">
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;

		.con-list {
			width: 100%;

			.list-item {
				border: 1px solid #303133;
				margin: 6px;
				padding: 6px;
				box-sizing: border-box;
				border-radius: 4px;

				.list-item-box {
					display: flex;
					align-items: center;
					justify-content: space-between;

					.item-con {
						display: flex;

						.list-item-title {
							font-weight: bold;
							margin-right: 8px;
						}

						.list-item-text {
							color: #666;
						}
					}
				}
			}
		}

		.loading-status {
			padding: 20px;
			text-align: center;
			width: 100%;

			.loading-text {
				color: #007AFF;
				font-size: 14px;
			}

			.finished-text {
				color: #999;
				font-size: 14px;
			}

			.loadmore-text {
				color: #666;
				font-size: 14px;
			}
		}
	}
</style>